* {
    margin: 0;
    padding: 0;
}
html,body,.page {
    height: 100%;
    position: relative;
}
@svg 1px-border {
    height: 2px;
    @rect {
        fill: var(--color, black);
        width: 100%;
        height: 50%;
    }
}
.hide {
    display: none;
}
.p-game {
    .g-container {
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        /* height: 900px; */
        width: 750px;
        /* background: #f2f2f2; */
        border-top: 1px solid transparent;
        border-image: ~'svg(1px-border param(--color red)) 2 0 0 0 stretch';
    }
    .b-start {
        position: absolute;
        bottom: 100px;
        left: 0;
        right: 0;
        margin: auto;
        width: 200px;
        height: 100px;
        line-height: 100px;
        text-align: center;
        font-size: 50px;
    }
}
.c-cards {
    .c-cards__card {
        width: 200px;
        height: 250px;
        line-height: 250px;
        padding: 25px;
        font-size: 50px;
        text-align: center;
        position: absolute;
        left: 0;
        top: 0;
        img {
            max-width: 200px;
            max-height: 250px;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;
        }
    }
}
